<!DOCTYPE html>
<html class="x-admin-sm">
<head>
    {include file="public/static" /}
</head>

<style>
    .layui-disabled, .layui-disabled:hover{
        cursor: pointer !important;
    }
    #updateButton{
        float: right;
        margin-top: 0.5rem
    }
    #submitButton{
        float: right;
        margin-top: 0.5rem;
        display: none;
    }
</style>

<body>

{include file="public/nav" /}

<div class="layui-fluid">
    <div class="layui-row layui-col-space15">
        <div class="layui-col-md12">
            <div class="layui-card">
                <form class="layui-form">
                    <div class="layui-card-header">
                        平台设置
                        <button id="updateButton" type="button" class="layui-btn layui-btn-danger" onclick="updateInfo()">修改</button>
                        <button id="submitButton" class="layui-btn" lay-filter="add" lay-submit="">提交</button>
                    </div>
                    <div class="layui-card-body ">
                        <table class="layui-table">
                            <tbody>
                                <tr>
                                    <th>平台名称：</th>
                                    <td>
                                        <div class="layui-input-inline">
                                            <input type="text" id="sy_website" name="sy_website" value="{$info.sy_website}"
                                                   lay-verify="website" autocomplete="off" class="layui-input">
                                        </div>
                                    </td>

                                    <th>平台状态：</th>
                                    <td>
                                        <input type="checkbox" id="sy_open" name="sy_open" lay-text="开启|停用" {eq name="info.sy_open" value="1"} checked {/eq} lay-skin="switch">
                                    </td>
                                </tr>
                                <tr>
                                    <th>图片最大体积/M：</th>
                                    <td>
                                        <div class="layui-input-inline">
                                            <input type="number" id="sy_photoMaxSize" name="sy_photoMaxSize" value="{$info.sy_photoMaxSize}"
                                                   lay-verify="photoMaxSize" autocomplete="off" class="layui-input">
                                        </div>
                                    </td>

                                    <th>文件最大体积/M：</th>
                                    <td>
                                        <div class="layui-input-inline">
                                            <input type="number" id="sy_fileMaxSize" name="sy_videoMaxSize" value="{$info.sy_fileMaxSize}"
                                                   lay-verify="fileMaxSize" autocomplete="off" class="layui-input">
                                        </div>
                                    </td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>
</body>
<script>
    $(function(){
        //初始状态
        startStatus();
    });
    //初始状态
    function startStatus(){
        $("input").attr("disabled","disabled").css({
            'border': 'none'
        });
        $("#updateButton").show();
        $("#submitButton").hide();
    }
    //修改
    function updateInfo() {
        $("input").removeAttr("disabled","disabled").css({
            'border-color': '#ff0000',
            'border-style': 'solid',
            'border-width': 1
        });
        $("#updateButton").hide();
        $("#submitButton").show();
    }
    // 表单
    layui.use(['form', 'layer'], function() {
        $ = layui.jquery;
        var form = layui.form,
            layer = layui.layer;
        //自定义验证规则
        form.verify({
            //名称
            website: function(value) {
                if (value.length < 2) {
                    return '平台名称不能小于2个字';
                }
                if(/^\d+\d$/.test(value)){
                    return '平台名称不能全为数字';
                }
                if(!new RegExp("^[a-zA-Z0-9_\u4e00-\u9fa5\\s·]+$").test(value)){
                    return '平台名称不能有特殊字符';
                }
            },
            photoMaxSize: function(value){
                if (value < 1) {
                    return '图片最大体积不能小于1';
                }
            },
            fileMaxSize: function(value){
                if (value < 1) {
                    return '文件最大体积不能小于1';
                }
            }
        });
        //监听提交
        form.on('submit(add)', function(data) {
            //平台是否开启
            data.field.sy_open = $("#sy_open").is(':checked');
            //发异步，把数据提交给php
            layer.confirm('确认要修改平台信息吗？',function(){
                var index = layer.load();
                $.ajax({
                    type:"post",
                    url:"{:url('System/websiteUpdate')}",
                    data: data.field,
                    dataType: 'json',
                    success:function (data) {
                        if(data.status === 1){
                            //恢复初始状态
                            startStatus();
                            layer.msg(data.info, {icon: 6,time:1500});
                        }else{
                            layer.msg(data.info, {icon: 5,time:1500});
                        }
                        layer.close(index);
                    },
                    error:function (data) {
                        layer.close(index);
                        layer.msg("不好意思，出现了一点问题", {icon: 5});
                    }
                });
            });
            //必须加上return false，不然无法关闭iframe
            return false;
        });
    });
</script>
</html>